<%
layout("head.html",{title:"达者列表"}){
%>
    <div class="layui-row" >
        <div class="release_baner layui-col-lg12">
            <div class="layui-row title_div layui-container">
                <h3 class="title layui-col-lg10" style="text-align: center;margin-top: -20px;margin-bottom: 15px;">
                    <span style="font-size: 25px">查找你需要的专家</span><br>
                    <span class="span">查看专家的专业经验,找到匹配的专家进行咨询</span>
                </h3>
                <form id="searchForm" class="default-condition-row layui-form" action="/recipient/getRecipientList" method="post">
                    <div class="expert-search-wrapper layui-row" style="margin-top: 10px;">
                        <div class="keyword-input  layui-col-lg-offset2 layui-col-lg4" >
                            <input placeholder="输入查找关键字" class="name" name="name" autocomplete="off">
                            <input type="hidden" class="page_now" name="pageNow" value="1" id="pageNumID"/>
                            <input type="hidden" class="page_size" name="pageSize" value="10" id="pageSizeID"/>
    `                    </div>
                        <div class="layui-col-lg3">
                            <span class="layui-form-item">
                                <span class="layui-inline" style="height: 50px;width: 100%">
                                    <span class="layui-input-inline" style="height: 50px;width: 100%">
                                        <select name="quiz" style="height: 50px;width: 100%">
                                            <option value="">请选择问题</option>
                                            <optgroup label="城市记忆">
                                                <option value="你工作的第一个城市">你工作的第一个城市</option>
                                                <option value="你工作的第一个城市">你工作的第一个城市</option>
                                                <option value="你工作的第一个城市">你工作的第一个城市</option>
                                                 <option value="你工作的第一个城市">你工作的第一个城市</option>
                                                <option value="你工作的第一个城市">你工作的第一个城市</option>
                                                <option value="你工作的第一个城市">你工作的第一个城市</option>
                                                 <option value="你工作的第一个城市">你工作的第一个城市</option>
                                                <option value="你工作的第一个城市">你工作的第一个城市</option>
                                                <option value="你工作的第一个城市">你工作的第一个城市</option>
                                                 <option value="你工作的第一个城市">你工作的第一个城市</option>
                                                <option value="你工作的第一个城市">你工作的第一个城市</option>
                                                <option value="你工作的第一个城市">你工作的第一个城市</option>
                                                <option value="你工作的第一个城市">你工作的第一个城市</option>
                                                <option value="你工作的第一个城市">你工作的第一个城市</option>
                                                <option value="你工作的第一个城市">你工作的第一个城市</option>
                                            </optgroup>
                                            <optgroup label="学生时代">
                                                <option value="你的工号">你的工号</option>
                                                <option value="你最喜欢的老师">你最喜欢的老师</option>
                                            </optgroup>
                                        </select>
                                    </span>
                                </span>
                            </span>
                        </div>
                        <div class="layui-col-lg2" style="margin-left: 30px">
                            <button type="button" class="el-button " >
                                <span id="searchSpan">搜&nbsp;索</span>
                            </button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div class="stick-layout container" style="min-height: 300px">
        <div class="contailer" style="width: 1100px" id="contailer">
            <!--beetl的ajax局部DOM刷新技术-->
            <% #ajax refreshRecipient:{%>
                <% if(isNotEmpty(results.data.list)){%>
                    <% for(user in results.data.list){%>
                        <div class="demand-item" style="min-height: 300px;">
                        <div style="padding-top: 30px;">
                            <div class="avatar-wrapper">
                                <img alt="" src="${user.photo}" width="76" height="76" class="avatar" lazy="loaded">
                            </div>
                        </div>
                        <div class="descript">
                            <h2 class="reci_name">${user.name}</h2>
                            <h4 style="font-size: 16px;font-weight: 400;margin: 12px 0;">${user.title}</h4>
                            <h2 class="be_goot_at">擅长方向</h2>
                            <div class="direction-list">
                                <div class="direction-item">
                                    <div class="concrete-directions">
                                        <span class="concrete-direction"></span>
                                        <!-- <span class="divider"> | </span>
                                         <span class="concrete-direction"></span>-->

                                        ${user.gootAt!}

                                            <% for(ss in strutil.split(user.gootAt,",")){ %>
                                               <!-- <p>${ss}</p>-->

                                            <%}%>

                                    </div>
                                    <!--<div class="direction-names">财务｜税务｜审计 &gt; 财务会计</div>-->
                                </div>
                                <!-- <div class="direction-item">
                                     <div class="concrete-directions">
                                         <span class="concrete-direction">股份制改造</span>
                                     </div>
                                     <div class="direction-names">股权｜IPO｜投融资 &gt; 主板上市</div>
                                  </div>-->
                                <a href="/expert/750" class="item-link">查看详情</a>
                            </div>
                        </div>
                        <div class="item-right">
                            <div class="line"></div>
                            <div class="inner-wrapper">
                                <p>城市：${user.address}</p>
                                <p>提供服务：${user.serverType}</p>
                                <button type="button" class="el-button btn el-button&#45;&#45;default">
                                    <span>添加到收藏</span>
                                </button>
                            </div>
                        </div>
                    </div>
                    <%}%>
                <%}else{%>
                    <div style="text-align: center;background-color: #fff;font-weight: bolder">暂无您查找的数据</div>
                <%}%>
                <div id="lay_page"  style="text-align: center;background-color: #fff"></div>
                <script type="text/javascript">
                    //搜索刷新分页，否则分页会保留上次记录。
                    if (!isUndefined(typeof laypage)) {
                        layPageFunction(laypage, "lay_page", '${results.data.page.pageSize!}', '${results.data.page.pageNow!}',
                            '${results.data.page.totalCount!}', "searchForm", "/recipient/refreshAjax?refreshName=refreshRecipient",
                            "contailer", "pageNumID", "pageSizeID", false);
                    }
                </script>
            <%}%>
        </div>
    </div>
    <script type="text/javascript">
        layui.use(['form','laypage','jquery','element'], function () {
            var element = layui.element;
            var form = layui.form;
            laypage = layui.laypage;
            $ = jQuery = layui.$;
            form.render();

            //初始化动态元素，一些动态生成的元素如果不设置初始化，将不会有默认的动态效果
            element.init();

            $layPageFunction(laypage,false);
            $("#searchSpan").click(function () {
                $layPageFunction(laypage,true);
            });
        });
        function $layPageFunction($laypage,is_once){
            layPageFunction($laypage, "lay_page", '${results.data.page.pageSize!}', '${results.data.page.pageNow!}',
                '${results.data.page.totalCount!}', "searchForm", "/recipient/refreshAjax?refreshName=refreshRecipient",
                "contailer", "pageNumID", "pageSizeID", is_once);
        }
    </script>

<%}%>